﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ODailyZGReportHighchartsPage.aspx.cs" Inherits="IHISCETeim.Web.MachineSys.MacModel.ODailyZGReportHighchartsPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <style type="text/css">
        html, body, div, span, applet, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, font, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td { padding:0; margin:0; font-size:12px; line-height:100%; font-family:Arial, sans-serif;}
        table{}
        .table{ border:1px solid #000; border-collapse:collapse;}
        .table th{ text-align:center; line-height:25px;border:1px solid #000;}
        .table td{ text-align:left; line-height:16px;border:1px solid #000;}
    </style>
    <script src="../js/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Highcharts/js/highcharts.js"></script>
    <script type="text/javascript" src="../Highcharts/js/themes/grid.js"></script>
    <%--1.每个项目中每台机器的直接工时平均值,以机型为主表,点柱状可查看各项目明细--%>
    <% if (ReportType == "1")
       {%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            var colors = Highcharts.getOptions().colors,
		    categories = <%=GetReport1JSCategories() %>,
		    name = '各机型直接检验工时平均值',
		    data = <%=GetReport1JSData() %>;

            function setChart(name, categories, data, color) {
                chart.xAxis[0].setCategories(categories);
                chart.series[0].remove();
                chart.setTitle({text:name});
                chart.addSeries({
                    name: name,
                    data: data,
                    color: color || 'white'
                });
            }

            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'column'
                },
                title: {
                    text: '各机型直接检验工时平均值'
                },
                subtitle: {
                    text: '<%=report1subtitle %>'
                },
                xAxis: {
                    categories: categories
                },
                yAxis: {
                    title: {
                        text: '每台机器平均直接检验工时/小时'
                    }
                },
                plotOptions: {
                    column: {
                        cursor: 'pointer',
                        point: {
                            events: {
                                click: function () {
                                    var drilldown = this.drilldown;
                                    if (drilldown) { // drill down
                                        setChart(drilldown.name, drilldown.categories, drilldown.data, drilldown.color);
                                    } else { // restore
                                        setChart(name, categories, data);
                                    }
                                }
                            }
                        },
                        dataLabels: {
                            enabled: true,
                            color: colors[0],
                            style: {
                                fontWeight: 'bold'
                            },
                            formatter: function () {
                                return this.y ;
                            }
                        }
                    }
                },
                tooltip: {
                    formatter: function () {
                        var point = this.point,
					    s = this.x + ':<b>' + this.y + '小时</b><br/>';
                        if (point.drilldown) {
                            s += '点击查看 ' + point.category + ' 直接作业内容明细';
                        } else {
                            s += '点击返回';
                        }
                        return s;
                    }
                },
                series: [{
                    name: name,
                    data: data,
                    color: 'white'
                }],
                exporting: {
                    enabled: false
                },
                legend: {
                    enabled:false
                }
            });
        });

    </script>
    <%} %>
    <%--2.每月直接间接工时对比--%>
    <% if (ReportType == "2"){%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    defaultSeriesType: 'column'
                },
                title: {
                    text: '每月直接间接工时对比'
                },
                xAxis: {
                    categories: <%=GetReport2JSCategories() %>
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: ''
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '' + this.series.name + ': ' + this.y + ' (' + Math.round(this.percentage) + '%)';
                    }
                },
                plotOptions: {
                    column: {
                        stacking: 'percent',
                        dataLabels: {
					        enabled: true,
					        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                            formatter: function () {
                                return Math.round(this.percentage) + '%' ;
                            }
				        }

                    }
                },
                exporting: {
                    enabled: false
                },
                series: <%=GetReport2JSSeries() %>
            });
        });

	</script>
    <%} %>
     <%--3.每个项目中每台机器负担工时平均值,以机型为主表,点柱状可查看各项目明细--%>
    <% if (ReportType == "3")
       {%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            var colors = Highcharts.getOptions().colors,
		    categories = <%=GetReport3JSCategories() %>,
		    name = '每个项目中每台机器负担工时平均值',
		    data = <%=GetReport3JSData() %>;

            function setChart(name, categories, data, color) {
                chart.xAxis[0].setCategories(categories);
                chart.series[0].remove();
                chart.addSeries({
                    name: name,
                    data: data,
                    color: color || 'white'
                });
            }

            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'column'
                },
                title: {
                    text: '每个项目中每台机器负担工时平均值'
                },
                subtitle: {
                    text: '<%=report3subtitle %>'
                },
                xAxis: {
                    categories: categories
                },
                yAxis: {
                    title: {
                        text: '每台机器平均工时/小时'
                    }
                },
                plotOptions: {
                    column: {
                        cursor: 'pointer',
                        point: {
                            events: {
                                click: function () {
                                    var drilldown = this.drilldown;
                                    if (drilldown) { // drill down
                                        setChart(drilldown.name, drilldown.categories, drilldown.data, drilldown.color);
                                    } else { // restore
                                        setChart(name, categories, data);
                                    }
                                }
                            }
                        },
                        dataLabels: {
                            enabled: true,
                            color: colors[0],
                            style: {
                                fontWeight: 'bold'
                            },
                            formatter: function () {
                                return this.y ;
                            }
                        }
                    }
                },
                legend: {
                    enabled:false
                },
                credits: {
                    enabled: false
                },
                tooltip: {
                    formatter: function () {
                        var point = this.point,
					    s = this.x + ':<b>' + this.y + '小时</b><br/>';
                        if (point.drilldown) {
                            s += '点击查看 ' + point.category + ' 项目明细';
                        } else {
                            s += '点击返回';
                        }
                        return s;
                    }
                },
                series: [{
                    name: name,
                    data: data,
                    color: 'white'
                }],
                exporting: {
                    enabled: false
                }
            });
        });

    </script>
    <%} %>
    <% if (ReportType == "4")
       {%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    defaultSeriesType: 'column',
                    marginRight: 90,
                    marginBottom: 50
                },
                title: {
                    text: '各员工工时统计对比'
                },
                subtitle: {
                    text: ''
                },
                xAxis: {
                    categories: <%=GetReport4JSCategories() %>,
                    title: {
                        text: '员工(小时)',
                        align: 'high'
                    }
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: ''
                    }
                },
                tooltip: {
                    formatter: function () {
                      //  return ' ' + this.x + ': ' + this.y + ' 小时';
                       // ---
                        var dataKey = 'ZGReport4_RealName_' + this.x;
	                    var html = jQuery.data(document.body, dataKey);
	                    if (html == undefined) {
	                        //ajax获取工位所耗时间明细
	                        html = $.ajax({
	                            url: "ODailyZGReportHighchartsPage.aspx?ajaxmethond=getzgreport4realname&WorkDateForm=<%=WorkDateForm %>&WorkDateTo=<%=WorkDateTo %>&RealName=" +  encodeURI(this.x) + "&hours=" + this.y,
	                            async: false
	                        }).responseText;
	                        jQuery.data(document.body, dataKey, html);
	                    } 
	                    return html;
                    }
                },
                plotOptions: {
                    bar: {
                        dataLabels: {
                            enabled: true
                        }
                    }
                },
                legend: {
                    enabled:false                   
                },
                credits: {
                    enabled: false
                },
                exporting: {
                    enabled: false
                },
                series: <%=GetReport4JSSeries() %>
            });
        });

	</script>
    <%} %>
    <%--5.各机型直接工作内容工时统计对比--%>
    <% if (ReportType == "5")
       {%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    defaultSeriesType: 'column',
                    marginRight: 140,
                    marginBottom: 40
                },
                title: {
                    text: '各机型直接工作内容工时统计对比'
                },
                xAxis: {
                    categories: <%=GetReport5JSCategories() %>
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: ''
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '' + this.series.name + ': ' + this.y + ' (' + Math.round(this.percentage) + '%)';
                    }
                },
                plotOptions: {
                    column: {
                        stacking: 'percent',
                        dataLabels: {
					        enabled: true,
					        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                            formatter: function () {
                                return Math.round(this.percentage) + '%' ;
                            }
				        }

                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: 0,
                    y: 30,
                    floating: true,
                    borderWidth: 1,
                    backgroundColor: '#FFFFFF',
                    shadow: true
                },
                exporting: {
                    enabled: false
                },
                series: <%=GetReport5JSSeries() %>
            });
        });

	</script>
    <%} %>
    <%--6.按月统计对比各工作内容所耗时间,--%>
    <% if (ReportType == "6")
       {%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    defaultSeriesType: 'column',
                    marginRight: 140,
                    marginBottom: 40
                },
                title: {
                    text: '按月统计对比各工作内容所耗时间'
                },
                xAxis: {
                    categories: <%=GetReport6JSCategories() %>
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: ''
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '' + this.series.name + ': ' + this.y + ' (' + Math.round(this.percentage) + '%)';
                    }
                },
                plotOptions: {
                    column: {
                        stacking: 'percent',
                        dataLabels: {
					        enabled: true,
					        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                            formatter: function () {
                                return Math.round(this.percentage) + '%' ;
                            }
				        }

                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: 0,
                    y: 30,
                    floating: true,
                    borderWidth: 1,
                    backgroundColor: '#FFFFFF',
                    shadow: true
                },
                exporting: {
                    enabled: false
                },
                series: <%=GetReport6JSSeries() %>
            });
        });

	</script>
    <%} %>
</head>
<body>
    <form id="form1" runat="server">
    <div id="container" style="width: <%=containerWidth%>px; height: <%=containerHeight%>px;margin: 0 auto"></div>
    <table align="center" width="<%=containerWidth%>px">
        <tr>
            <td>
    <% if (ReportType == "1")
       {%>
     

    <%} %>
     <% if (ReportType == "2")
       { %>
    <table width="90%">
     <tr>
        <td align="center">每月直接间接工时对比</td>
        <td align="center">&nbsp;</td>
    </tr>
    <tr>
     <td  valign="top">
        <asp:repeater id="rp2_1" runat="server">
        <HeaderTemplate>
            <table class="table" width="100%" >
            <thead>
                <tr  >  
                    <th width="80" align="center">
                        月份
                    </th>
                    <th width="100">
                        间接工时(小时)
                    </th> 
                    <th  width="80">比例</th>
                    <th width="100">
                        直接工时(小时)
                    </th>  
                    <th  width="80">比例</th>              
                </tr>
            </thead>
            <tbody>
         </HeaderTemplate>
         <ItemTemplate>
                <tr target="sid_user" >			
				    <td><%# Eval("dategroup")%></td>
				    <td><%# Convert.ToDecimal( Eval("间接")).ToString("f2")%></td>
                    <td><%# GetPer2(Eval("间接"), Eval("直接"))%></td>
                    <td><%# Convert.ToDecimal( Eval("直接")).ToString("f2")%></td>
                     <td><%# GetPer2(Eval("直接"), Eval("间接"))%></td>
			    </tr>
         </ItemTemplate>
         <FooterTemplate>
                </tbody>
             </table>
         </FooterTemplate>
        </asp:repeater>
    </td>
     <td valign="top">
        <asp:repeater id="rp2_2" runat="server">
        <HeaderTemplate>
            <table class="table" width="100%" >
            <thead>
                <tr  >  
                    <th width="80" align="center">
                        作业类型
                    </th>
                    <th width="80">
                        工时(小时)
                    </th>
                    <th>比例</th>                
                </tr>
            </thead>
            <tbody>
         </HeaderTemplate>
         <ItemTemplate>
                <tr  >			
				    <td><%# Eval("jobtype")%></td>
				    <td><%# Convert.ToDecimal( Eval("tasktime")).ToString("f2")%></td>
                    <td><%# GetPer2_1(Eval("tasktime"))%></td>
			    </tr>
         </ItemTemplate>
         <FooterTemplate>
                </tbody>
             </table>
         </FooterTemplate>
        </asp:repeater>
     </td>
    </tr>
    </table>
    <%} %>

      <% if(ReportType=="3") {%>
     
    <asp:repeater id="rpMachineTaskTimeChart3" runat="server">
    <HeaderTemplate>
        <table class="table" Width="100%">
        <thead>
            <tr  >  
                <th  align="center">
                    项目(台数)
                </th>
                <th >
                    单台直接工时
                </th>
                <th >
                    单台间接工时
                </th>
                <th >
                    单台合计工时
                </th>
            </tr>
        </thead>
        <tbody>
        </HeaderTemplate>
        <ItemTemplate>
            <tr target="sid_user" >			
				<td><a  title="查看此项目各工位所耗工时" href="ODailyReport_GetMachineTaskTime4_GroupBySerialNumberHighcharts.aspx?WorkDateForm=<%=WorkDateForm %>&WorkDateTo=<%=WorkDateTo %>&SerialNumber=<%# Eval("SerialNumber") %>"" target="_blank" ><%# Eval("SerialNumber")%></a></td>
				<td><%# Convert.ToDecimal( Eval("zj")).ToString("f2")%></td>
                <td><%# Convert.ToDecimal( Eval("jj")).ToString("f2")%></td>
				<td><%# Convert.ToDecimal( Eval("alltasktime")).ToString("f2")%></td>
			</tr>
        </ItemTemplate>
        <FooterTemplate>
            </tbody>
            </table>
        </FooterTemplate>
    </asp:repeater>
   
    <%} %>

    <% if(ReportType=="5") {%>
     
    <asp:GridView ID="GridView5" runat="server" CssClass="table" AutoGenerateColumns="true" Width="100%">
    </asp:GridView>
        
    <%} %>
     <% if(ReportType=="6") {%>
    
    <asp:GridView ID="GridView6" runat="server" CssClass="table" AutoGenerateColumns="true" Width="100%">
    </asp:GridView>
       
    <%} %>
    </td>
        </tr>
    </table>
    </form>
</body>
</html>
